<!-- 传入数组，返回被选索引 -->
<template>
	<view class="list-select">
		<view class="item" :class="{'selected':checked === index}" v-for="(item,index) of list" @click="select(index)">{{item}}</view>
	</view>
</template>

<script>
	export default {
		name:'list-select',
		data() {
			return{
				checked: 0
			}
		},
		props:{
			list:{
				type: Array,
				default:['传','入','数','组']
			}
		},
		methods: {
			select(e){
				this.checked = e;
				this.$emit('wen',e)
			}
		}
	}
</script>

<style scoped lang="scss">
	.list-select{
		display: flex;
	}
	.item{
		margin-right: 20rpx;
		width: 100rpx;
		height: 50rpx;
		text-align: center;
		line-height: 50rpx;
		color: #383838;
		font-size: 12px;
		border-radius: 15rpx;
		background-color: #f2f2f2;
	}
	.selected{
		background-color: #2ba4f7;
		color: #fff;
	}
</style>
